<template>
  <text>
    {{ moneyArr[0] }}.<text class="dot">{{ moneyArr[1] }}</text>
  </text>
</template>

<script lang="ts" setup>
  const props = defineProps({
    money: { type: String, default: '0.00' },
    size: { type: Number, default: 25 },
  });
  const moneyArr = parseFloat(props.money).toFixed(2).split('.');
  const fontSize = props.size + 'rpx';
</script>

<style lang="scss" scoped>
  .dot {
    font-size: v-bind(fontSize);
  }
</style>
